<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">

<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-cache/no-store" />

<link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css" />
<link rel="stylesheet" type="text/css" href="leftAndRight/list-style.css" />
<style>
  h3,h4,table{
   text-align:center
  }
  .list-title{
		width: 98%;
		height: 40px;
		line-height: 40px;
		padding-left: 10px;
		border-bottom: 1px solid #adadad;
		cursor: move;
		color:#fff;
		background: #1E90FF;
	}
	.list-body .left-box2,.list-body .left-box-add, .list-body .right-box2 , .list-body .right-box-add{
		width: 39%;
		border: 1px solid #ceadad;
		border-radius: 3px;
		margin: 10px 10px;
		background: #fff;
	}
</style>

<title>考勤机管理</title>
</head>
<body>
        
    <!--主内容-->
	<div class="page-container col-md-12">
		<button class="btn btn-primary radius" id="add">新增</button>
	    <table id="queryTable" class=" table table-border table-bordered table-bg table-hover">
	       <thead>
	       		<tr>
	              <th>设备编号</th>
	              <th>设备名称</th>
	              <th>操作</th>
	          	</tr>
	       </thead>
	       <tbody>
	       </tbody>
	    </table>
	</div>
	<div id="addModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<span class="modal-title" id="myModalLabel">添加考勤机</span>
				</div>
				<div class="modal-body">
					<table class="table table-bg table-hover table-border">
						<tr>
							<td>设备编号</td>
							<td>
								<input id="deviceId" class="input-text" type="text" placeholder="请输入16位字母数字混合的设备序列号"/>
							</td>
						</tr>
						<tr>
							<td>设备名称</td>
							<td>
								<input id="deviceName" class="input-text" type="text" placeholder="不超过20个字符"/>
							</td>
						</tr>
					</table>
				</div>
				<div class="modal-footer">
				    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-primary radius" id="confirm">确定</button>
				</div>
			</div>
		</div>
    </div>
    <div id="updateModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<span class="modal-title" id="myModalLabel">修改考勤机</span>
				</div>
				<div class="modal-body">
					<table class="table table-bg table-hover table-border">
						<tr>
							<td>设备编号</td>
							<td>
								<input id="update-deviceId" class="input-text" type="text" disabled="disabled"/>
							</td>
						</tr>
						<tr>
							<td>设备名称</td>
							<td>
								<input id="update-deviceName" class="input-text" type="text" placeholder="不超过20个字符"/>
							</td>
						</tr>
					</table>
				</div>
				<div class="modal-footer">
				    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-primary radius" id="updateBtn">确定</button>
				</div>
			</div>
		</div>
    </div>
	<div id="manageModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog" style="margin-bottom:0px;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<span class="modal-title" id="manageModalLabel">设置管理员</span>
				</div>
				<div class="modal-body" style="height:calc(90vh - 178px);overflow:auto;">
				    <div id="selectTitle" class="list-select ui-draggable">
						<div class="list-title ui-draggable-handle">
							<div style="font-size:16px;text-align:center;">选择管理员，最多不能超过5个管理员（选项可双击、单击进行选择）</div>
						</div>
						<div class="list-body">
							<ul class="item-box left-box ui-sortable ui-droppable">
							</ul>
							<div class="center-box">
								<button class="add-one btn btn-success radius" title="添加选中项">&gt;</button>
								<button class="add-all btn btn-success radius" title="添加全部">&gt;&gt;</button>
								<button class="remove-one btn btn-primary radius" title="移除选中项">&lt;</button>
								<button class="remove-all btn btn-primary radius" title="移除全部">&lt;&lt;</button>
							</div>
							<ul class="item-box right-box ui-sortable ui-droppable">
							</ul>
						</div>
					</div>
				</div>
				<div class="modal-footer">
				    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-primary radius" id="manageModalBtn">确定</button>
				</div>
			</div>
		</div>
    </div>
<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="https://upload.shinehao.com.cn/20180810145355jquery.min1.9.1.js"></script> 
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="https://upload.shinehao.com.cn/20180810150731H-ui.min3.0.2.js"></script> 
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script>
<script type="text/javascript" src="https://upload.shinehao.com.cn/20180813175723jquery.dataTables1.10.0.js"></script>
<!--/_footer 作为公共模版分离出去 -->

<!--请在下方写此页面业务相关的脚本 -->
<script type="text/javascript" src="lib/laypage/1.2/laypage.js"></script>
<script type="text/javascript" src="https://upload.shinehao.com.cn/20180810172341echarts.common.min3.4.0.js"></script>
<script type="text/javascript" src="myJs/util.js"></script>
<script type="text/javascript" src="attendJs/attendDeviceManage.js"></script>

</body>
</html>